// define the namespace
syslib.namespace("syslib.ui");

// tag conversor
syslib.ui.AccordeonTag = __class(syslib.ui.TagConversor, {
	
});

// component definition
syslib.ui.Accordeon = __class(syslib.ui.UIComponent, {
	__componentName : "syslib.ui.Accordeon", 
	
	id : "", 
	height : 0,
	menuHeight: 0,
	itens : [], 
	selectedItem : null, 

	__construct : function(options){
		// load the style
		syslib.loadStyleForComponent("accordeon");
		
		// set the class attributes
		this.element		= null;
		this.id 			= (__valid(options.id)) ? options.id : syslib.element.generateID();
		this.style			= (__valid(options.style)) ? options.style : "";
		this.height 		= 0;
		this.menuHeight 	= 0;
		this.itens 			= [];
		this.selectedItem 	= null;
		
	},

	__createElement : function(){
		// format the attributes
		var attributes = __extend(this.__attributes, { 
			"id" : this.id,
			"class" : "syslib-accordeon-main-container",
			"style" : this.style
		});

		// create the structure
		var elemtJSON = ["div", attributes];

		// create the element
		var accordeonData = syslib.element.createFromJSON(false, elemtJSON);

		// store the element
		this.__element = accordeonData.element;
		
		// return
		return accordeonData.element;
	},

	appendTo : function(container){
		container.appendChild(this.getElement());
		
		// schedule the size correction to run every one seconds
		setInterval(this.__setSize.applyTo(this), 1000);
	},

	appendChild : function(child){
		// get the index
		var index = this.itens.length;
		
		// set the item
		this.itens[index] = child; 
		
		// set the height
		this.menuHeight += 32;
		
		this.getElement().appendChild(child.getElement());
		
		// return
		return index;
	},

	selectItem : function(id){
		// check if there's a selected item
		if(__valid(this.selectedItem)){
			// get the selected item
			var selectedItem = this.itens[this.selectedItem];
			
			// update the status of the item
			selectedItem.__unselect();
			
			// resize
			if(syslib.ui.fx.isLoaded(syslib.ui.fx.Resize)){
				syslib.ui.fx.Resize.setHeight(selectedItem.body, 0);
			} else {
				selectedItem.__body.style.height = "0px";				
			}
		}
		
		// ge the item to be selected
		var item = this.itens[id];
		
		// update the status of the item
		item.__select();
		
		// set this item as the selected item of this accordeon
		this.selectedItem = id;
		
		// calculates the new size
		var newSize = this.height - this.menuHeight;
		if(newSize <= 0){
			return;
		}
		
		// resize
		if(syslib.ui.fx.isLoaded(syslib.ui.fx.Resize)){
			syslib.ui.fx.Resize.setHeight(item.body, newSize);
		} else {
			item.__body.style.height = newSize + "px";  				
		}
	}, 
	
	__setSize : function(){
		// get the parent height
		var parentHeight = this.__element.parentNode.clientHeight;
		var height = parentHeight - (this.__element.clientTop * 2);
		
		// check if this is a considerable change
		if(this.height - height >= -10 && this.height - height <= 10){
			return;
		}
		
		// set the height in this instance
		this.height = height;
		
		// get the content height
		var contentHeight = parentHeight - this.height;
		if(contentHeight < 0){ 
			return;
		}
		
		// set the style
		this.__element.style.overflow = "hidden";
		
		// set the content container height
		if(syslib.ui.fx.isLoaded(syslib.ui.fx.Resize)){
			syslib.ui.fx.Resize.setHeight(this.__element, this.height);
		} else {
			this.__element.style.height = this.height + "px";
		}
		
		// get the selected item
		var selectedItem = this.itens[this.selectedItem];
		
		// set the selected item height
		if(syslib.ui.fx.isLoaded(syslib.ui.fx.Resize)){
			syslib.ui.fx.Resize.setHeight(selectedItem.body, (this.height - this.menuHeight));
		} else {
			selectedItem.body.style.height = (this.height - this.menuHeight) + "px";
		}
	}
});